<template>
  <view class="empty" :style="{ marginTop: top }">
    <view class="img ta-c">
      <slot>
        <image class="empty-img" src="@/assets/images/no_info@2x.png" style="width: 200px; height: 130px" />
      </slot>
    </view>
    <view class="text">
      {{ text }}
    </view>
  </view>
</template>
<script lang="ts" setup>
defineProps({
  text: {
    type: String,
    default: '暂无相关信息',
  },
  width: {
    type: String,
    default: '200px',
  },
  height: {
    type: String,
    default: '130px',
  },
  top: {
    type: String,
    default: '0px',
  },
});
</script>
<style lang="scss" scoped>
.empty {
  position: relative;
  left: 50%;
  transform: translateX(-50%);

  .text {
    color: rgba(0, 0, 0, 0.3);
    text-align: center;
    padding: 40rpx;
    font-size: 14px;
  }
}
</style>
